<template>
	<view class="content">
		<image class="logo" :src="userInfo.avatarUrl"></image>
		<view class="text-area">
			<text class="title">{{userInfo.nickName}}</text>
		</view>
		<view class="margin-top: 20px;">
			<text class="desc">openid：{{userInfo.openId}}</text>
		</view>
		
		<view style="margin-top: 50px">
			<button type="primary" @click="onJumpHome">回到首页</button>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { ref } from "vue";
	import { onLoad } from "@dcloudio/uni-app";
	
	const userInfo = ref({
		nickName: "",
		openId: "",
		avatarUrl: "",
	});
	let openId = ref();
	
	const sxf_theater = uniCloud.importObject("sxf-theater");
	
	onLoad(async(option) => {
		console.log("option", option);
		openId.value = option.openId;
		console.log("openid：", openId.value);
		userInfo.value = await sxf_theater.getUserInfo({ openId: openId.value });
		console.log("userInfo：", userInfo.value);
	});
	
	const onJumpHome = () => {
		// 进入首页
		uni.redirectTo({
			url: "/pages/ticker/list"
		});
	};
</script>

<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 30rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	
	.desc {
		font-size: 26rpx;
		color: #8f8f94;
	}
</style>
